<script setup lang="ts">
</script>
<template>
    <view class="viewport">
        <view class="tops-boxs">
            <view class="tos">
                <image src="" mode="scaleToFill" class="ims" />
                <view class="mod-box"></view>
                <view class=""></view>
            </view>
        </view>
        <view class="mids-boxs"></view>
        <view class="bots-boxs"></view>
    </view>
</template>
<style lang="scss">
.viewport {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.tops-boxs {
    height: 382rpx;
    width: 100%;
    background-color: #F2BB16;
    display: flex;
    flex-direction: column;

    .tos {
        display: flex;
        margin-top: 80rpx;
        height: 138rpx;
        width: 100%;
        background-color: #1385a8;
    }
}

.mids-boxs {
    height: 86rpx;
    width: 100%;
    background: #f1f1f1;
}

.bots-boxs {
    display: flex;
    height: 100%;
    width: 100%;
    flex-direction: column;
}
</style>
